<template>
  <v-card flat min-height="312">
    <v-spacer class="d-flex dialog-content">
      <v-col class="pb-0 text-left">
        <v-textarea
          v-bind="$attrs"
          v-on="$listeners"
          v-validate="'required'"
          name="Message"
          class="white-input"
          hide-details
          solo
          height="234"
          no-resize
        >
        </v-textarea>
        <span class="vee-validate-error">
          {{ errors.first("Message") }}
        </span>
      </v-col>
      <v-col class="mt-4 pt-0">
        <v-btn
          width="32"
          height="32"
          color="#556282"
          fab
          elevation="0"
          class="send-btn ml-2"
          @click="submit"
        >
          <v-icon color="#fff">
            {{ propType === "approval" ? "mdi-check" : "mdi-close-thick" }}
          </v-icon>
        </v-btn>
      </v-col>
    </v-spacer>
  </v-card>
</template>
<script lang="ts">
import { Vue, Component } from "vue-property-decorator";
@Component({
  props: {
    type: String,
  },
})
export default class Message extends Vue {
  get propType() {
    return this.$props.type;
  }

  async submit() {
    const validate = await this.$validator.validate();
    this.$emit("submit", validate);
  }
}
</script>
<style lang="scss" scoped>
@import "@/components/Quotation/Dialog/Dialog.scss";
</style>
